import { useEffect } from 'react'
import { Select } from 'antd'
import { useSelector, useDispatch } from 'react-redux'
import { getChannels } from '@/store/actionCreators/article'
const { Option } = Select

const Channel = props => {
  const dispatch = useDispatch()
  useEffect(() => {
    dispatch(getChannels())
  }, [dispatch])

  const { channels } = useSelector(state => state.article)

  return (
    <Select
      placeholder='请选择文章频道'
      style={{ width: 200 }}
      onChange={val => props.onChange(val)}
      {...props}
    >
      {channels.map(item => {
        return (
          <Option key={item.id} value={item.id}>
            {item.name}
          </Option>
        )
      })}
    </Select>
  )
}

export { Channel }
